<template>
	<view class="imp-term-list">
		<view class="title">
			刑期
		</view>
		<view class="imp-term-list-main">
			<view class="imp-term-item" v-for="item in impTermList" :key="item">
				<view class="imp-rate">
					{{item.rate}}%
				</view>
				<view class="imp-progress" :style="{'height':100*(item.rate/100)+'rpx'}"/>
				<view class="imp-label">
					{{item.label}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				impTermList:[
					{
						rate:20.6,
						label:'6个月',
					},
					{
						rate:30.7,
						label:'7个月',
					},
					{
						rate:40.8,
						label:'8个月',
					},
					{
						rate:50.9,
						label:'9个月',
					},
					{
						rate:61,
						label:'10个月',
					},
					{
						rate:70.2,
						label:'11个月',
					},
				]
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "./impTermList.scss";
</style>
